import { createGraphConfig } from '@antv/xflow';
import Node1 from './react-node/node1';
import Node2 from './react-node/node2';
import Edge1 from './react-edge/edge1';
import Edge2 from './react-edge/edge2';

export const useGraphConfig = createGraphConfig((config) => {
  /** 设置画布配置项，会覆盖XFlow默认画布配置项 */
  config.setX6Config({
    grid: true,
    scaling: { min: 0.2, max: 3 },
    // mousewheel: { enabled: true, zoomAtMousePosition: true },
  });

  /** 设置画布需要渲染的React节点、连线上的React内容 */
  config.setNodeRender('NODE1', (props) => <Node1 {...props} />);
  config.setNodeRender('NODE2', (props) => <Node2 {...props} />);
  config.setEdgeRender('EDGE1', (props) => <Edge1 {...props} />);
  config.setEdgeRender('EDGE2', (props) => <Edge2 {...props} />);
});
